<!--  -->
<template>
  <div style="background-color:#ebedf0;height:calc(100vh - 50px)">
    <div style="padding:6px 16px 16px 16px;background-color:#fff">
      <div>
        <van-field  class="font18 font_bold" autosize rows="1" type="textarea" v-model="drawtitle" :placeholder="'标题'"  style="padding:1px 7px;font-size: 18px;"></van-field>
      </div>
      <van-divider ></van-divider>
      <div >
        <van-field  class="font16" autosize rows="2" type="textarea" v-model="drawinfos" :placeholder="'期待你的分享...'"  style="padding:1px 7px;font-size: 16px;min-height:166px"></van-field> 
      </div>
    <van-uploader :before-read="beforeRead" v-model="fileList" :after-read="fileUpload" :before-delete="beforedelete"  capture="camera" accept="image/*"/>
    <!-- <input type="file" accept="image/*"> -->
<!-- <button @click="uploadaaaa()">点击上传</button> -->
    <!-- <van-uploader  v-model="fileList" multiple :after-read="fileUpload" :before-delete="beforedelete" /> -->
    </div>
  
    <!-- <van-divider  :style="{  borderColor: '#ebedf0',margin: '0px' ,borderWidth: '16px 0 0'}"></van-divider> -->
    <!-- <van-field readonly required v-model="isTrueName" label-width="4.5em" label="是否实名:" style="font-size: 16px;" :right-icon="'arrow'" @click="showTypePicker=true"/>
      <van-popup v-model="showTypePicker" position="bottom">
        <van-picker
            show-toolbar
            :columns="showTypecolumns"
            @confirm="showTypePickeronConfirm"
            @cancel="showTypePicker = false"
        />
      </van-popup> -->
    <div class="middleIcon">
      <van-button @click="tosubmint()" color="#F06F3F" round type="info" class="font14" style="height:58px;width:58px">发表</van-button>
    </div>
   
  </div>
</template>

<script>
  import {mapGetters} from 'vuex'
  import {Notify,Toast} from 'vant'
  import {contentcreate,uploadProcessFilesYglt,uploadProcessFiles} from '@/api/gettodo'
  import Compressor from 'compressorjs';

  export default {
    components: {

    },
    data() {
      return {
        fileList:[],
        sendfilesList:[],
        drawtitle:'',
        drawinfos:'',
        isTrueName:'否',
        showTypecolumns:['是','否'],
        showTypePicker:false,
        parentCategoryId:'',
        parentCategoryName:'',
        categoryId:'',
        categoryName:'',
        anonymous:true,
        needTodo:false
      }
    },
    computed: {
     ...mapGetters(["user"]),
    },
    activated(){
      this.fileList=[];
      this.sendfilesList=[];
      this.drawtitle='',
      this.drawinfos='',
      this.isTrueName='否',
      this.showTypecolumns=['是','否'],
      this.showTypePicker=false,
      this.parentCategoryId='',
      this.parentCategoryName='',
      this.categoryId='',
      this.categoryName='',
      this.anonymous=true
      this.parentCategoryId = this.$route.query.parentCategoryId;
      this.parentCategoryName = this.$route.query.parentCategoryName;
      this.categoryId = this.$route.query.categoryId;
      this.categoryName = this.$route.query.categoryName;
      this.needTodo=this.$route.query.needTodo;
    },
    //生命周期--创建完成
    created() {
      
    },
    //生命周期--挂载完成
    mounted() {

    },
    //方法调用
    methods: {
      showTypePickeronConfirm(value){
        this.isTrueName=value;
        if(this.isTrueName=='是'){
          this.anonymous=false
        }else{
          this.anonymous=true
        }
        this.showTypePicker=false;
      },
      tosubmint(){
        if(!this.drawtitle){
          Notify('请输入标题')
          return
        }
        if(!this.drawinfos){
          Notify('请输入内容')
          return
        }
        var params = {
          userName: this.user.userName,
          fromdata:{
            categoryId: this.categoryId,
            categoryName: this.categoryName,
            parentCategoryId: this.parentCategoryId,
            parentCategoryName: this.parentCategoryName,
            title: this.drawtitle,
            content: this.drawinfos,
            anonymous: this.anonymous,
            topicId: '',
            topicName: '',
            typeId: 'V583986575998173184',
            typeName: '帖子',
            fileList:this.sendfilesList,
          }
        };
        Toast.loading({
          message: '提交中',
          forbidClick:true
        });
        contentcreate(params).then((res) => {
          Toast.clear()
          if(!res.data){
            Notify(res.message)
            return
          }
          if(!res.data.data&&res.data.errcode==500){
            Notify(res.message)
            return
          }
          if(res.data.data.status&&res.data.data.status=='0'){
            Notify({type:'success',message:'已交给管理员审核'})
          }else{
            Notify({type:'success',message:'发帖成功'})
          }
          // if(this.needTodo){
            
          // }else{
            
          // }
          
          this.$router.back(-1);
         });
      },
      fileUpload(file,detail){
            console.log('111'+JSON.stringify(file))
            let dataurl=file.content;
            let arr = dataurl.split(','),
            mime = arr[0].match(/:(.*?);/)[1],
            bstr = atob(arr[1]),
            n = bstr.length,
            u8arr = new Uint8Array(n);
            while (n--) {
                u8arr[n] = bstr.charCodeAt(n);
            }
            var filename=    this.fileList[0].file.name;
            let fileData = new FormData();
            fileData.append('pmInsType', 'A');
            fileData.append('pmInsTypePart', '1');       
            fileData.append('files', new File([u8arr], filename+"", {
                    type: mime
                }));
            // this.fileList=[];
            Toast.loading({
                message: '加载中...',
                forbidClick: true,
            });
            uploadProcessFiles(fileData,Object.assign({userName:this.user.userName}))
            .then(res=>{
              Toast.clear();
              if(!res.data){
                  Notify(res.message);
                  return;
              }
              this.sendfilesList=this.sendfilesList.concat(res.data.data.sysFiles[0]);
              console.log('fileUpload2222'+JSON.stringify(this.sendfilesList))
            })
            .catch(err=>{
              Toast.clear();
              Notify('上传失败');
            })
            // drawFiles
        },beforedelete(index,index2,index3,index4){
          console.log('beforedelete2222'+JSON.stringify(index2.index))
          this.sendfilesList.splice(index2.index,1);
          this.fileList.splice(index2.index,1);
          console.log('beforedelete2222'+JSON.stringify(this.sendfilesList))
        },
        beforeRead(file) {
          if (file.type == 'image/png'||file.type == 'image/jpeg'||file.type == 'image/jpg') {
            return true;  
            // if(file.size <= 1024*1024*2) {
            //   return true;  
            // }else {
            //   return new Promise((resolve, reject) => {
            //     new Compressor(file, {
            //       quality: 0.7,
            //       convertTypes: ['image/png', 'image/jpg','image/jpeg'],
            //       convertSize: 2000000,
            //       success(result) {
            //         resolve(result)
            //       },
            //       error(err) {
            //         reject(err)
            //       }
            //     })
            //   })  
            // }
          }else{
            Toast('请上传图片类型文件');
            return false;
          }
          
        },
        uploadaaaa(){
          this.moaBridge_ha_djfupt.getQRCode();
        },
    }
  }
</script>
<style  scoped>
/* @import url();*/
::v-deep .van-field__label {
    -webkit-box-flex: 0;
    -webkit-flex: none;
    flex: none;
    box-sizing: border-box;
    width: 6.2em;
    margin-right: 12px;
    color: #333333;
    text-align: left;
    word-wrap: break-word;
}
.middleIcon{
  position: fixed;
  bottom: 0;
  right: 0;
  text-align: center;
  margin-right: 36px;
  margin-bottom: 99px;
}
</style>